<template>
  <div>
    <a-modal width="570px" :mask="false" :visible="visible" @ok="handleOk" @cancel="closeDialog" style="width: 300px;" :footer="null">
      <template #title>
        <div ref="modalTitleRef" style="width: 100%">{{ "用户信息" }}</div>
      </template>
      <template #modalRender="{ originVNode }">
        <div :style="transformStyle">
          <component :is="originVNode" />
        </div>
      </template>
      <a-form :model="formState" layout="horizontal" name="formState" autocomplete="off" :labelCol="{ span: 6 }">
        <a-form-item name="userName" label="用户名">
          <a-input v-model:value="formState.userName" readonly></a-input>
        </a-form-item>
        <!-- <a-form-item name="password" label="密码">
          <a-input v-model:value="formState.password" type="password" readonly></a-input>
        </a-form-item> -->
      </a-form>
    </a-modal>
  </div>
</template>

<script>
import { Draggable } from "@/mixins/DraggableMixin"
export default {
  mixins: [Draggable],
  data() {
    return {
      visible: true,
      formState: {
        userName: localStorage.getItem("userName") || 1111,
        password: 111111
      }
    }
  },
  methods: {
    closeDialog() {
      this.$emit("closeDialog")
    },
    handleOk() {
      this.closeDialog()
    }
  },
}
</script>